<template>
  <div class="replyCon">
    <van-divider
    :style="{ color: '#1989fa', borderColor: '#1989fa', padding: '0 16px' }"
    >
    我的评论
    </van-divider>
    <van-list v-model="loading" :finished="finished" finished-text="没有更多了" :offset="10"  @load="onLoad">
        <van-cell v-for="reply in replyList" :key="reply.replyId" >
            <p> {{reply.replybody}}</p>
            <p>{{reply.createTime}}</p>
            <p v-if="reply.delete === false" class="replyblock">该评论已被封禁，只有自己可见</p>
        </van-cell>
    </van-list>
  </div>
</template>

<script>
export default {
    data() {
        return {
            replyList: [],
            queryInfo: {
                query: '',
                //当前页数
                pagenum: 1,
                //当前每页显示多少数据
                pagesize: 10
            },
            total: '',
            loading: false,
            finished: false,
        }
    },
    methods: {
        async getReplyList() {
            const {data: res} = await this.$http.post("/api/post/getAllReplyByUserId",{pagenum:this.queryInfo.pagenum,pagesize:this.queryInfo.pagesize})
            if (res.code !== 200) {
                this.$toast('回复加载失败')
                return
            }
            if (res.data.records.length === 0) {  		// 判断获取数据条数若等于0
                this.finished = true;		// 停止加载
            }
            //数据不为0
            this.replyList.push(...res.data.records)//加载数据
            this.total = res.data.total //给数据条数赋值
            this.loading = false			// 加载状态结束 
            // 如果list长度大于等于总数据条数,数据全部加载完成
            if (this.replyList.length >= res.data.total) {
                this.finished = true	// 结束加载状态
            }
            console.log(res.data)
        },
        onLoad() {
            this.getReplyList()
            this.queryInfo.pagenum++
        }       
    }
}
</script>

<style lang="less" scoped>
.replyCon {
    margin-bottom: 50px;
}
.replyblock {
    color: red;
}
</style>